Aggiungi un pulsante di azione mobile

Prova il metodo Scrivi
Jetpack Compose è il toolkit per l'interfaccia utente consigliato per Android. Scopri come aggiungere componenti in Compose.
Pulsante di azione mobile →

Un pulsante FAB (azione mobile) è un pulsante circolare che attiva l'istanza principale nell'interfaccia utente dell'app. Questa pagina ti mostra come aggiungere il FAB al tuo layout, personalizzarne l'aspetto e rispondere al tocco dei pulsanti.

Per scoprire di più su come progettare un pulsante di azione mobile nella tua app in base alle linee guida di Material Design, consulta anche la sezione Pulsanti: pulsante di azione fluttuante.

Figura 1. Un pulsante di azione mobile

Aggiungi il pulsante di azione mobile al layout

Il seguente codice mostra come FloatingActionButton deve vengono visualizzate nel file di layout: 

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:src="@drawable/ic_my_icon"
        android:contentDescription="@string/submit"
        android:layout_margin="16dp" />

Per impostazione predefinita, il FAB viene colorato in base all'attributo colorAccent. che puoi personalizzare con la tavolozza dei colori del tema.

Puoi configurare altre proprietà FAB utilizzando file XML o metodi corrispondenti, come i seguenti:

  • Le dimensioni del FAB, utilizzando l'attributo app:fabSize o il Metodo setSize().
  • Il colore dell'onda del FAB, utilizzando l'attributo app:rippleColor o la Metodo setRippleColor().
  • L'icona FAB, utilizzando l'attributo android:src o Metodo setImageDrawable().

Rispondere ai tocchi dei pulsanti

Puoi quindi applicare un View.OnClickListener per gestire i FAB tocchi. Ad esempio, il seguente codice mostra un Snackbar quando l'utente tocca il FAB:

Kotlin

val fab: View = findViewById(R.id.fab)
fab.setOnClickListener { view ->
    Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
            .setAction("Action", null)
            .show()
}

Java

FloatingActionButton fab = findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        Snackbar.make(view, "Here's a Snackbar", Snackbar.LENGTH_LONG)
                .setAction("Action", null).show();
    }
});

Per ulteriori informazioni sulle funzionalità del FAB, consulta il riferimento all'API per FloatingActionButton.